import React from 'react'
// ===================================================================== Temp
import SearchForm from '#cpt/temp/SearchForm'
import Table from '#cpt/temp/Table'
import TableControls from '#cpt/temp/TableControls'
import Delete from '#cpt/temp/Delete'
import Controls from '#cpt/temp/Controls'
import AddEditModal from '#cpt/temp/AddEditModal'
// ===================================================================== Declare
const { $fn, $Lazy } = window
// ===================================================================== private component
const Page 			= $Lazy.load(()=>import('#tp/page/page-container'))
const $cache 		= $Lazy.file(()=>import('#private/cache-api'))
const UseLogModal 	= $Lazy.state(()=>import('./_cpt/useLog-modal'))
const Tips 			= $Lazy.load(()=>import('#tp/tips'))
// ===================================================================== component
class Index extends React.Component{
	state = {
		data:[],
		pag: {},
		selectedKeys: [],
		selectedRows: [],
		// 搜索表单列表
		forms : [
			{ label: '场景名称',		name: 'authorzation_scene', type:'select',	idStr: 'scene_name',	nameStr: 'scene_name', loading:true },
			{ label: '授权对象',		name: 'authorzation_user',	type:'select',	idStr: 'uuid',	nameStr: 'real_name', loading:true },
			{ label: '授权时间',		names: ['start_at','end_at'],	type:'date-range', },
		],
		// 提交表单列表
		formData : [
			{ label: '共享签名人',	name: 'real_name',  			full:true, 		disabled:true 	},
			{ label: '签名图片',		name: 'signature',			 	full:true,		disabled:true, 		type:'upload'},
			{ label: '使用场景',		name: 'authorzation_scene',		full:true,		required:true,		type:'select', idStr: 'uuid', nameStr: 'scene_name',	loading:true, mode: 'multiple' },
			{ label: '被授权人',		name: 'authorzation_user',	 	full:true,		required:true,		type:'select', idStr: 'uuid', nameStr: 'real_name',	loading:true },
			{ label: '授权时间',		name: 'time',	 				full:true,		required:true, 		type: 'date-range' }
		]
	}
	model = {}
	query = { type:2 }
	
	componentDidMount(){
		this.getSelect()
		this.fetch()
	}

	// 获取下拉数据
	getSelect = () => {
		const { forms, formData } = this.state
		$cache.then( async f => {
			const { authorzation_user, authorzation_scene } = await f.getCache( { api:'conf-authorzation/getShareEmp', refresh:true } )
			// 被授权人
			$fn.setRows( [ forms,formData ], 'authorzation_user', authorzation_user)
			// 使用场景
			$fn.setRows( [ forms,formData ], 'authorzation_scene', authorzation_scene)
			// 
			this.setState({ forms })
		})
	}
	// paging
	fetch = () => $fn.fetch.call(this,'conf-authorzation/index')
	
	// 表单
	cols = [
		{ title: '场景名称',			dataIndex: 'authorzation_scene_name', 	width:100 },
		{ title: '授权对象',			dataIndex: 'authorzation_user_name',	width:100 },
		{ title: '授权时间',			dataIndex: 'authorzation_start_time',	width:150 },
		{ title: '过期时间',			dataIndex: 'authorzation_end_time',		width:150 },
		// { title: '最近使用时间', 	dataIndex: 'recently_time',				width:100 },
		// { title: '使用次数',			dataIndex: 'dura_max',					width:100 },
		TableControls.controls.call(this,{ width: 210 }),
	]
	
	// 表格操作按钮
	table_controls = (text, rows) => {
		const { uuid, authorzation_scene_uuid, authorzation_user_uuid, authorzation_start_time, authorzation_end_time } = rows
		return [
			TableControls.edit.call(this, false,() => {
				
				this.formRef.setValue({
					authorzation_scene	: [ authorzation_scene_uuid ],
					authorzation_user	: authorzation_user_uuid,
					time				: [authorzation_start_time, authorzation_end_time],
				})
				$fn.disabledRows(this.state.formData, ['authorzation_scene', 'authorzation_user'], true)
			}, { rows: { uuid }, label: '授权延期' } ),
			this.onDel([uuid]),
			TableControls.click.call(this, '查看使用记录', ()=> this.useLogModalRef.open(rows) ),
		]
	}

	// 操作按钮
	controls = () =>  [
		Controls.add.call(this, {
			click: ()=> {
				const { formData } = this.state
				$fn.disabledRows(formData, ['authorzation_scene', 'authorzation_user'], false)
				this.setState({ formData })
			}
		}),
		this.onDel()
	]
	// 取消授权
	onDel = uuid => Delete.call(this, 'conf-authorzation/del', { uuid, isKeys: !uuid, idStr: 'uuids', label:'取消授权' })
	
	
	render(){
		return (
			<>
				<Page title='授权签名管理' controls={this.controls()}>
					{/* 搜索 */}
					{ SearchForm.call(this) }
					{/* 表格 */}
					{ Table.call(this) }
				</Page>
				{/* 添加、编辑 */}
				{ 
					AddEditModal.call(this,{ addText:'授权签名', editText:'授权延期', labelWidth:'s6', width:500, api:'conf-authorzation/add', editApi:'conf-authorzation/edit',
						getSubmit:({time})=> {
							const { uuid } = $fn.getUser()
							return { authorzation_owner:uuid, authorzation_start_time: time[0], authorzation_end_time: time[1] }
						},
						open: () => {
							const { real_name, signature } = $fn.getUser()
							this.formRef.setValue({ real_name, signature })
						},
						suffix: <Tips text='如 “授权对象” 在同一应用场景有多个签名时，优先使用最近时间授权的签名' className='mb20' danger />
					})
				}
				{/* 使用记录弹窗 */}
				<UseLogModal onRef={ref=>this.useLogModalRef=ref} />
			</>
		)
	}
}

export default Index